const width=window.innerWidth
const rem=width/100
document.documentElement.style.fontSize=rem+'px'
const window11=document.querySelector('.window')
//定义一个登录状态的全局变量函数
window.Islogin=0
window.userKey=""
const LoginSuccess='LoginSuccess'
//渲染登录页面函数
function LoginWindow(){
    window11.innerHTML=`
        <h1>登录页面</h1>
        <div class="email">
            <span>账号/邮箱:</span>
            <input type="text" placeholder="请输入邮箱" class="email1">
        </div>
        <div class="password">
            <span>密码:</span>
            <input type="text" placeholder="请输入密码" class="password1">
        </div>
        <button class="submit">登录</button>
        <button class="register">注册</button>
        <button class="close">x</button>
    `
}
//渲染注册页面函数
function RegisterWindow(){
    window11.innerHTML=`
        <h1>注册页面</h1>
        <div class="email2">
            <span>邮箱:</span>
            <input type="text" placeholder="请输入注册邮箱" class="email3">
        </div>
        <div class="username">
            <span>用户名:</span>
            <input type="text" placeholder="请输入注册用户名" class="username1">
        </div>
        <div class="password2">
            <span>密码:</span>
            <input type="text" placeholder="请输入注册密码" class="password3">
        </div>
        <button class="backLogin">返回登录</button>
        <button class="submitRegister">提交注册</button>
        <button class="close1">x</button>
    `
}
document.addEventListener('click',function(event){
    //点击登录按钮，渲染登录页面
    if(event.target.classList.contains('login')&&event.target.closest('.head .person')){
        window11.classList.add('active')
        LoginWindow()
    }
    //点击x让登录弹窗消失(已完成)
    if((event.target.classList.contains('close')||event.target.classList.contains('close1'))
        &&event.target.closest('.window')){
        window11.classList.remove('active')
    }
    //点击注册按钮，渲染注册页面
    if(event.target.classList.contains('register')&&event.target.closest('.head .person')){
        window11.classList.add('active')
        RegisterWindow()
    }
    if(event.target.classList.contains('register')&&event.target.closest('.window')){
        RegisterWindow()
    }
    if(event.target.classList.contains('backLogin')&&event.target.closest('.window')){
        LoginWindow()
    }
    //登录注册页面切换已完成
    //这是提交登录信息
    if(event.target.classList.contains('submit')&&event.target.closest('.window')){
        const email1=document.querySelector('.email1').value
        const password1=document.querySelector('.password1').value
        if(email1!=''&&password1!=''){
            let xhr=new XMLHttpRequest()
            xhr.open(
                'POST',
                `http://43.136.111.27:8086/user/login?email=${email1}&&password=${password1}`
            )
            xhr.send()
            xhr.onreadystatechange=function(){
                if(xhr.status==200&&xhr.readyState==4){
                  let response=JSON.parse(xhr.responseText)
                  console.log(response)
                  if(response.code=="200"){
                        alert('登录成功')
                    window11.classList.remove('active')
                    window.Islogin=1
                    window.userKey=response.data
                    document.dispatchEvent(new CustomEvent(LoginSuccess,{
                        detail:window.userKey
                    }))
                  }
                  else{
                    alert('用户名或密码有误')
                  }
                }
            }
        }
        else{
            alert('邮箱和密码不能为空')
        }
    }
    //这是提交注册信息
    if(event.target.classList.contains('submitRegister')&&event.target.closest('.window')){
        const email3=document.querySelector('.email3').value
        const username1=document.querySelector('.username1').value
        const password3=document.querySelector('.password3').value
        const data={
            email:email3,
            username:username1,
            password:password3
        }
        if(email3==''||username1==''||password3=='')
            alert('邮箱，用户名，密码不能为空')
        else{
            let xhr=new XMLHttpRequest()
            xhr.open(
                'POST',
                'http://43.136.111.27:8086/user/register'
            )
            xhr.setRequestHeader('Content-Type','application/json')
            xhr.send(JSON.stringify(data))
            xhr.onreadystatechange=function(){
            if(xhr.readyState===4&&xhr.status===200){
                let response=JSON.parse(xhr.responseText)
                if(response.code==200)
                alert('注册成功')
                window11.classList.remove('active')
                }    
            }
        }
    }
})